import Swal from 'sweetalert2'
import './../../style/menu.scss'
import $ from 'jquery';
let isName1, isPhone1, isYZM, isQuestion

infoBox()
inputChange1()
chooseAuto('#choose1', 'chooseImg1', '.name1', '.phone1')
updateSwiperData()



// 发送请求事件触发 页面中

document.querySelector('#submit1')?.addEventListener('click', function (e) {
    e.preventDefault();

    let yzm = document.querySelector('.yzm-box')

    // 这里需要修改为验证码
    // if(yzm.value != '1234'){

    //     Swal.fire({
    //         position: 'center',
    //         icon: 'error',
    //         title: '验证码错误',
    //         showConfirmButton: false,
    //         timer: 1500
    //     })
    //     return 
    // }

    inputChange1().then((res) => {

        if (res) {
            // console.log('合法，发送请求 11点12分', res);
            $.ajax({
                //请求方式
                type: "POST",
                //请求的媒体类型
                Headers: {
                    "Access-Control-Allow-Origin": "*"
                },
                //请求地址
                url: "http://lawyeracloud.seo.com.cn/Api/ApiUn/AddUnknownApi",
                //数据，json字符串
                data: {
                    name: res.name,
                    phone: res.phone,
                    question: res.question

                },
                //请求成功
                success: function (result) {
                    console.log(result);
                },
                //请求失败，包含具体的错误信息
                error: function (e) {
                    console.log(e.status);
                    console.log(e.responseText);
                }
            });


            // 判断验证码

            Swal.fire({
                position: 'center',
                icon: 'success',
                title: '提交成功',
                showConfirmButton: false,
                timer: 1500
            })

            $('.name1').val('')
            $('.phone1').val('')
            $('.question').val('')
            


        } else {
            console.log('不合法',);

            Swal.fire({
                position: 'center',
                icon: 'error',
                title: '请输入正确的信息',
                showConfirmButton: false,
                timer: 1500
            })


        }

    })

})


// 判断输入内容是否符合规范  页面中
async function inputChange1() {
    let name = document.querySelector('.name1')
    let phone = document.querySelector('.phone1')
    let question = document.querySelector('.question')
    // console.log('question', question);
    let res = false, res2 = false;


    await name.addEventListener('change', () => {
        const reg1 = /^[\u4e00-\u9fa5]{2,8}$/
        res = reg1.test(name.value)
        if (res) {
            isName1 = true
        } else {
            isName1 = false
            Swal.fire({
                position: 'center',
                icon: 'error',
                title: '请输入2-8位姓名',
                showConfirmButton: false,
                timer: 1000
            })
        }

    })

    await phone.addEventListener('change', () => {
        const reg2 = /^1[0-9]{10}$/

        res2 = reg2.test(phone.value)
        if (res2) {
            isPhone1 = true
        } else {
            isPhone1 = false
            Swal.fire({
                position: 'center',
                icon: 'error',
                title: '请输入正确的手机号',
                showConfirmButton: false,
                timer: 1000
            })
        }

    })



    await question.addEventListener('change', () => {
        // 是否写入问题
        // console.log('111', 111);
        if (question.value != '') {
            isQuestion = true
            console.log('isQuestion',isQuestion);
        } else {
            isQuestion = false
            Swal.fire({
                position: 'center',
                icon: 'error',
                title: '请输入问题',
                showConfirmButton: false,
                timer: 1000
            })
        }
    })

   

    // console.log('isQuestion', isQuestion);
    if (isName1 && isPhone1 && isQuestion) {
        return {
            name: name.value,
            phone: phone.value,
            question: question.value
        }

    }
    return false
}



// 验证码
document.querySelector('.yzm')?.addEventListener('click', () => {
    console.log('......', document.querySelector('.yzm').innerHTML);
    if (document.querySelector('.yzm').innerHTML == '获取验证码') {
        Swal.fire({
            text: "验证已发送，请注意查收",
            confirmButtonText: '确定',
        })
        let time = 60
        let timefunc = setInterval(() => {
            document.querySelector('.yzm').innerHTML = (time--) + ''
            if (time == -1) {
                clearInterval(timefunc)
                document.querySelector('.yzm').innerHTML = '获取验证码'
            }
        }, 1000)
    } else {
        Swal.fire({
            text: "请稍后再试",
            confirmButtonText: '确定',
        })
    }

})

// 显示个人信息授权
function infoBox() {
    let privactArr = document.querySelectorAll('.privacy')
    privactArr.forEach((item) => {
        item.addEventListener('click', () => {
            Swal.fire({
                title: '个人信息授权与隐私政策',
                html:
                    ' 尊敬的用户，您选择使用“自动输入历史信息”功能，您同意本平台在法律允许的范围内，收集您输入的信息，您已知晓并同意在您浏览使用本平台建站服务搭建的页面时， 我们会帮您预先填写上次输入的历史信息，您的历史信息仅用于页面的预填充，且只有您点击提交按钮之后信息才会传递给商家使用。 本平台非常重视用户信息的保护，详见' +
                    '<a style="color:#405b95;" target="_blank" href="https://fe-resource.cdn.bcebos.com/mip/fengming/form/Interactive_optimization_of_privacy_protocol_corresponding.html">《隐私政策》</a> ',

                showCloseButton: true,
                confirmButtonText:
                    '确定',

            })
        })
    })
}



// 点击小图标
function chooseAuto(clickSpanId, imgId, nameInputClass, phoneInputClass) {
    // 设置勾选和未勾选
    document.querySelector(clickSpanId)?.addEventListener('click', function () {
        let img = document.getElementById(imgId)
        let nameBox = document.querySelector(nameInputClass)
        let phoneBox = document.querySelector(phoneInputClass)
        if (img.getAttribute('style') == 'display:none') {
            // 勾选
            img.setAttribute('style', '')
            nameBox.setAttribute('autocomplete', 'on')
            phoneBox.setAttribute('autocomplete', 'on')

        } else {
            // 未勾选
            nameBox.setAttribute('autocomplete', 'off')
            phoneBox.setAttribute('autocomplete', 'off')
            img.setAttribute('style', 'display:none')

        }

    })

}




// 修改最新参与客户
async function updateSwiperData() {

    let swiperBox = document.querySelector('.swiper-wrapper')

    await $.ajax({
        type: "GET",
        Headers: {
            "Access-Control-Allow-Origin": "*"
        },
        // dataType:'jsonp',
        // jsonp: "callback",
        url: "http://lawyeracloud.seo.com.cn/Api/ApiUn/GetUnknownApi",
        data: {
            "pageSize": "20",
            "pageIndex": "1"
        },
        success: function (result) {
            // console.log('res',result.swiperObj);

            let swiperObj = result.swiperObj

            if(result.count != undefined){
                $('#questionCount').text(300+result.count)
            }
           
            // let swiperObj = [{
            //     name: "赵**",
            //     phone: '139****8766',
            //     time: 1621245135//时间戳
            // }, {
            //     name: "钱**",
            //     phone: '139****8766',
            //     time: 1621245135
            // }, {
            //     name: "孙**",
            //     phone: '139****8766',
            //     time: 1621245135
            // }, {
            //     name: "李**",
            //     phone: '139****8766',
            //     time: 1621245135
            // }]

            let html = ''
            let time = ''
            let icon = ''
            let tag = document.querySelector('#index')
            if (tag == null) {
                icon = '711c933a038d1bf49eec'
            } else {
                icon = 'a8e1b0eafed24cae8a37'
            }
            for (const item of swiperObj) {
                // console.log('item', item.name);
                // console.log('item', item.phone);
                // console.log('item', item.time);

                // console.log('111',
                //     getDateDiff(1318781876406)
                // );
                time = getDateDiff(1618781876406)

                // a8e1b0eafed24cae8a37
                html = html + `
            <div class="swiper-slide">
                <span><img src="images/${icon}.svg" alt=""></span>
                <span>${item.name}</span>
                <span>${item.phone}</span>
                <span>${time}</span>
            </div>
            `


            }
            swiperBox.innerHTML = html



        },
        error: function (e) {
            console.group('error',);
            console.log(e);
            console.groupEnd();
        }
    });


}




// 获取过去时间
function getDateDiff(dateTimeStamp) {
    var minute = 1000 * 60;
    var hour = minute * 60;
    var day = hour * 24;
    var halfamonth = day * 15;
    var month = day * 30;
    var year = month * 12;
    var now = new Date().getTime();
    var diffValue = now - dateTimeStamp;
    if (diffValue < 0) { return; }
    var yearC = diffValue / year;
    var monthC = diffValue / month;
    var weekC = diffValue / (7 * day);
    var dayC = diffValue / day;
    var hourC = diffValue / hour;
    var minC = diffValue / minute;
    var result

    if (yearC >= 1) {
        result = "" + parseInt('' + yearC) + "年前";
    } else if (monthC >= 1) {
        result = "" + parseInt('' + monthC) + "月前";
    }
    else if (weekC >= 1) {
        result = "" + parseInt('' + weekC) + "周前";
    }
    else if (dayC >= 1) {
        result = "" + parseInt('' + dayC) + "天前";
    }
    else if (hourC >= 1) {
        result = "" + parseInt('' + hourC) + "小时前";
    }
    else if (minC >= 1) {
        result = "" + parseInt('' + minC) + "分钟前";
    } else
        result = "刚刚";
    return result;
}


$('.menu-style').click(() => {
    if ($('.menu-style').children('img.menu-svg').css('display') == 'none') {

        $('.menu-style').children('img.menu-svg').css('display', 'block')
        $('.menu-style').children('img.close-svg').css('display', 'none')
    } else {

        $('.menu-style').children('img.menu-svg').css('display', 'none')
        $('.menu-style').children('img.close-svg').css('display', 'block')
    }
    $('.menu-list').slideToggle()
})
